﻿var Icon = antd.Icon;
var Breadcrumb = antd.Breadcrumb;
var Menu = antd.Menu;
const SubMenu = Menu.SubMenu;
var Table = antd.Table;
const MenuItemGroup = Menu.ItemGroup;
var Link = ReactRouter.Link;
const App = React.createClass({
    getInitialState() {
        return {
            current: '1'
        };
    },
    handleClick(e) {
        console.log('click ', e);
         
        this.setState({
            current: e.key
        });
    },
    render() {
        return (
    <div className="ant-layout-aside">
      <aside className="ant-layout-sider">
        <div className="ant-layout-logo"></div>
        <Menu mode="inline" theme="dark" onClick={this.handleClick} selectedKeys={[this.state.current]}
        defaultOpenKeys={['sub1']}>
<SubMenu key="sub1" title={<span><Icon type="user" />管理</span>}>
  <Menu.Item  key="1" ><Link to='/user'>用户管理</Link></Menu.Item>
   <Menu.Item key="2"><Link to='/about'>about</Link></Menu.Item>
</SubMenu>
<SubMenu key="sub2" title={<span><Icon type="laptop" />导航二</span>}>
  <Menu.Item key="5">选项5</Menu.Item>
  <Menu.Item key="6">选项6</Menu.Item>
  <Menu.Item key="7">选项7</Menu.Item>
  <Menu.Item key="8">选项8</Menu.Item>
</SubMenu>
<SubMenu key="sub3" title={<span><Icon type="notification" />导航三</span>}>
  <Menu.Item key="9">选项9</Menu.Item>
  <Menu.Item key="10">选项10</Menu.Item>
  <Menu.Item key="11">选项11</Menu.Item>
  <Menu.Item key="12">选项12</Menu.Item>
</SubMenu>
  </Menu>
</aside>
<div className="ant-layout-main">
<div className="ant-layout-header">
    header
</div>
<div className="ant-layout-breadcrumb">
<Breadcrumb>
  <Breadcrumb.Item>首页</Breadcrumb.Item>
  <Breadcrumb.Item>应用列表</Breadcrumb.Item>
  <Breadcrumb.Item>某应用</Breadcrumb.Item>
</Breadcrumb>
</div>
<div className="ant-layout-container">
<div className="ant-layout-content">
  <div style={{ height: 590 }} id="centercontent">
{this.props.children}
        </div>
      </div>
    </div>
        <div className="ant-layout-footer">
            SAIC Demo APP footer
        </div>
  </div>
    </div>
    );
}
});
